<html>
<head>
<title>Rotating 3D Swirl in 256 Bytes JavaScript made for a (D)HTML Compo</title>
<style type="text/css">
body{background:#000;color:khaki;}
a{color:khaki;}
a:hover{color:#FF0;}
address{bottom:10px;font-family:Georgia;font-style:normal;position:absolute;right:10px;text-align:right;}
</style>
</head>
<body>

<!--

This script was made for my (D)HTML competition "256b.htm" (see
http://wildmag.de/compo/). The original script is 256 bytes small. It
uses the "all" object collection, which is a bad "Internet Explorer only" but
makes the code smaller. Here it is:

<body bgcolor=0 text=khaki><script>S=Math.sin;for(a=48;a--;document.write('<b id=l'+a+'>Z</b>'));setInterval('for(i=48;i--;)with(eval("l"+i).style){position="absolute";g=S(i/15)*11;left=50+S(a-i)*g+"%";top=i*2+"%";fontSize=S(a-i+8)*g+18}a+=.1',30)</script>

The following version of the script is a lot larger, contains comments and runs
in every browser.

-->

<script type="text/javascript">

/* Create a shortcut so we can call S() instead of Math.sin(). */
S = Math.sin;

/* Create the elements with ids from "i0" to "i47". */
for (a = 48; a--; document.write('<b id=l' + a + '>Z</b>'))
{
	/* The body of the for loop is empty. */
}

/* Repeat every 30 milliseconds, so we get 33 frames per second. */
setInterval(function()
{
	/* Change the style of every element. */
	for (i = 48; i--; )
	{
		with (document.getElementById("l" + i).style)
		{
			/* It's useless to set this again and again, but this makes the code smaller. */
			position = "absolute";

			/* This variable is created to make the following code smaller. */
			g = S(i / 15) * 11;

			/* Set font size and absolute position in percent. */
			left = 50 + S(a - i) * g + "%";
			top = i * 2 + "%";
			fontSize = S(a - i + 8) * g + 18;
		}
	}
	a += 0.1;
}, 30);

</script>

<address>&copy; <a href="http://maettig.com/">Thiemo M&auml;ttig</a>,
created in <a href="http://wildmag.de/compo/">August 2002</a><br />
<a href="./">More JavaScript experiments &raquo;</a></address>

</body>
</html>